<template>
  <div id="app">
    <Header/>
    <div class="content">
      <SideBar class="sidebar"/>
      <router-view class="router-view"/>
    </div>
    <Footer/>
  </div>
</template>

<script>
  import Header from "@/components/content/header/Header";
  import SideBar from "@/components/content/sidebar/SideBar";
  import Footer from "@/components/content/footer/Footer";

  export default {
    name: 'App',
    components:{
      Header,
      SideBar,
      Footer,
    },
  }
</script>

<style>
  @import "assets/css/base.css";
  @import "assets/css/iconfont.css";
  #app{
    /*height: 100vh;*/
    width: 100%;
    overflow-x: hidden;
  }
  .content{
    display: flex;
    /*height: calc(100vh - 44px - 50px);*/
  }
  .router-view{
    /*position: fixed;*/
    /*left: 137px;*/
    /*padding: 10px 20px 100px 20px;*/
    /*bottom: 50px;*/
  }
</style>
